<template>
  <div class="wrap" v-loading>
    <order-detail
      :order="order"
      :order-detail="order_detail"
      :is-detail="true"
    ></order-detail>
  </div>
</template>

<script>

import OrderDetail from "@/views/packetOrders/components/OrderDetail.vue";
import {getPacketOrderInfo} from "@/api/packetOrders";

export default {
  components: {
    OrderDetail
  },
  props: {
  },
  data() {
    return {
      order_detail:{},
      order: {
        orderId: '',
        goodsData: [],
        packetWeight: '',
        packetLength: '',
        packetWidth: '',
        packetHeight: '',
        confirmationCode: 'None',
        buyerName: '',
        buyerPhone: '',
        buyerPostalCode: '',
        buyerState: '',
        buyerStateCode: '',
        buyerCity: '',
        buyerAddress: '',
        remark: '',
      },
    }
  },
  created() {
    if (this.$route.query.orderId) {
      this.isCreate = false;
      this.getOrderInfo(this.$route.query.orderId);
    } else {
      this.$router.push({name: 'packetOrders'});
    }
  },
  methods: {
    getOrderInfo(orderId) {
      this.loading = true;
      getPacketOrderInfo(orderId)
          .then(res => {
            this.order = res.data.packetOrder;
            this.order_detail = res.data;
            this.order.spStickerPrice = res.data.packetOrder.preSpStickerPrice;
            this.order.totalStickerAppend = res.data.packetOrder.preStickerAppend;
            this.order.logisticTypePrice = res.data.packetOrder.preLogisticTypePrice;
            this.order.packageMaterialPrice = res.data.packetOrder.prePackingCharge;
            this.order.totalFee = this.order.spStickerPrice + this.order.totalStickerAppend + this.order.logisticTypePrice + this.order.packageMaterialPrice;
            this.loading = false;
          })
    },
  }
}
</script>

<style scoped lang="less">
.wrap{
  padding: 30px;
}
</style>
